<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

    <script>

        // request   response  


        // readyState  ajax请求时的状态
        // 0  已经创建了，未载入
        // 1  已经发送
        // 2  发送成功
        // 3  处理中
        // 4  处理完成


        // status  响应的状态    
        //    200  成功
        //    404  路径错误

        var data;


        // ajax 是一个对象     request请求
        const xhr = new XMLHttpRequest();
        console.log(xhr.readyState);  // 0

        // 请求方式   请求的地址   是否异步的
        // xhr.open(请求方式, 地址, true);

        xhr.open('get', '../data/1.json', true);

        // 发送
        xhr.send();
        console.log(xhr.readyState);  // 1

        // 等待
        xhr.onreadystatechange = function () {
            // console.log(666);
            // console.log(xhr.readyState);   // 2 3 4
            // console.log(xhr.status);   // 404   200
            if (xhr.readyState === 4 && xhr.status === 200) {
                console.log(xhr.responseText);
                data = xhr.responseText;
                document.write(data);
            }
        }



    </script>

</body>

</html>